<!-- 重置密码 - resetPassword--  -->
<template>
  <view>
    <!-- 标题栏 -->
    <view class="head-box ss-m-b-60">
      <view class="head-title ss-m-b-20">{{$t('pages.user.info.shezhi')}}{{$t('pages.user.info.loginpwd')}}</view>
      <view class="head-subtitle">{{$t('pages.user.info.pwdcontent')}}</view>
    </view>

    <!-- 表单项 -->
    <uni-forms
      ref="resetPasswordRef"
      v-model="state.model"
      :rules="state.rules"
      validateTrigger="bind"
      labelWidth="140"
      labelAlign="center"
    >
      <!-- <uni-forms-item name="email" :label="$t('pages.withdraw.emailVerif')"> -->
       <!-- <uni-easyinput
          :placeholder="$t('pages.withdraw.pleaseEnterEmail')"
          v-model="state.model.email"
          :inputBorder="false"
        >
          <template v-slot:right>
            <button
              class="ss-reset-button code-btn code-btn-start"
              :disabled="state.isMobileEnd"
              :class="{ 'code-btn-end': state.isMobileEnd }"
              @tap="getEmsCode('resetPassword', state.model.email)"
            >
              {{ getEmsTimer('resetPassword') }}
            </button>
          </template>
        </uni-easyinput> -->
      <!-- </uni-forms-item> -->

     <!-- <uni-forms-item name="code" :label="$t('pages.withdraw.verifCode')">
        <uni-easyinput
          :placeholder="$t('pages.withdraw.pleaseEnterVerifCode')"
          v-model="state.model.code"
          type="number"
          maxlength="4"
          :inputBorder="false"
        ></uni-easyinput>
      </uni-forms-item> -->

      <uni-forms-item name="password" :label="$t('pages.user.info.loginpwd')">
        <uni-easyinput
          type="password"
          :placeholder="$t('pages.user.info.loginpwd')"
          v-model="state.model.password"
          :inputBorder="false"
        >
          <template v-slot:right>
            <button class="ss-reset-button login-btn-start" @tap="resetPasswordSubmit">
             {{$t('pages.goods.order.queren')}}
            </button>
          </template>
        </uni-easyinput>
      </uni-forms-item>
    </uni-forms>

    <button v-if="!isLogin" class="ss-reset-button type-btn" @tap="showAuthModal('accountLogin')">
     {{$t('pages.user.info.login')}}
    </button>
  </view>
</template>

<script setup>
  import { computed, watch, ref, reactive, unref } from 'vue';
  import sheep from '@/sheep';
  import { code, mobile, email, password } from '@/sheep/validate/form';
  import { showAuthModal, closeAuthModal, getSmsCode, getSmsTimer, getEmsCode, getEmsTimer } from '@/sheep/hooks/useModal';

  const resetPasswordRef = ref(null);
  const isLogin = computed(() => sheep.$store('user').isLogin);

  // 数据
  const state = reactive({
    isMobileEnd: false, // 手机号输入完毕
    model: {
      mobile: '', //手机号
      code: '', //验证码
      password: '', //密码
    },
    rules: {
      code,
      email,
      mobile,
      password,
    },
  });

  // 4.重置密码
  const resetPasswordSubmit = async () => {
    const validate = await unref(resetPasswordRef)
      .validate()
      .catch((error) => {
        console.log('error: ', error);
      });
    if (!validate) return;
    sheep.$api.user.resetPassword(state.model).then((res) => {
      if (res.code === 1) {
        sheep.$store('user').getInfo();
        closeAuthModal();
      }
    });
  };
</script>

<style lang="scss" scoped>
  @import '../index.scss';
</style>
